<template>
    <div class="index" >
      <el-form label-position="top" :model="operateForm" :inline="true" :rules="operateFormRules" ref="operateFormRules"  >
      <el-card class="index">
        <div slot="header" class="clearfix">
        <span>营业执照</span>
      </div>
        <el-row>
             <el-col :span="6">
               <el-form-item label="营业执照附件" prop="pLicense" style="width: 100%;display: flex;justify-content: center;align-items: center;flex-direction: column;">
                <el-upload
                :action="uploadUrl"
                :headers="token"
                  :show-file-list="false"
                  :on-success="doorUpLoadSuccessF07"
                  :before-upload="beforeUploadImgF07"
                  >
                  <img v-if="operateForm.pLicense" :src="operateForm.pLicense" class="avatar">
                  <div v-else>
                     <img style="margin-bottom: -15px;" class="avatar-none"  src="https://dashboard.huifu.com/member/static/img/default-idcard-front.svg" alt="">
                    <el-button size="mini" type="primary">点击上传</el-button>
                  </div>
                </el-upload>
               </el-form-item>
             </el-col>
             <el-col :span="6">
                <el-form-item label="商户注册名称" prop="merchantName"  style="width: 100%;">
                  <el-input  v-model.trim="operateForm.merchantName" style="width: 80%;" placeholder="请输入商户注册名称" clearable  />
                </el-form-item>
            </el-col>
            <el-col :span="6">
                <el-form-item label="营业执照编号"  prop="businessLicence"  style="width: 100%;">
                  <el-input   v-model.trim="operateForm.businessLicence" style="width: 80%;" placeholder="请输入营业执照编号"   clearable/>
                </el-form-item>
            </el-col>
            <el-col :span="6">
              <!-- areaId -->
                <el-form-item label="商户注册地址" prop="areaArr"  style="width: 100%;">
                  <el-cascader
                     style="width: 80%;"
                     v-model="operateForm.areaArr"
                     :options="regionList"
                     :props="detailRegion"
                     @change="detailRegionChange">
                   </el-cascader>
                </el-form-item>
            </el-col>
            <el-col :span="6">
                <el-form-item label="商户注册详细地址"  prop="merchantAddress"  style="width: 100%;">
                  <el-input   v-model.trim="operateForm.merchantAddress" style="width: 80%;" placeholder="请输入商户注册详细地址"   clearable/>
                </el-form-item>
            </el-col>
            <el-col :span="12">
                <el-form-item label="证件有效期" prop="businessLicenceStt" style="width: 100%;">
              <el-date-picker
                v-model="operateForm.businessLicenceStt"
                value-format="yyyyMMdd"
                type="date"
                placeholder="开始日期">
              </el-date-picker>
              <span style="margin: 0 10px;">至</span>
              <el-date-picker
                v-model="operateForm.businessLicenceExpire"
                value-format="yyyyMMdd"
                :disabled="operateForm.licenseValidityType > 0"
                type="date"
                placeholder="截止日期">
              </el-date-picker>
                <el-checkbox style="margin-left: 20px;" true-label="1" false-label="0" v-model="operateForm.licenseValidityType" @change="licenseChange">长期有效</el-checkbox>
            </el-form-item>
            </el-col>
        </el-row>
    </el-card>
    <el-card class="index">
        <div slot="header" class="clearfix">
        <span>法人信息</span>
      </div>
        <el-row>
          <el-col :span="6">
               <el-form-item label="法人身份证人像面" prop="pIdcardA" >
                <el-upload
                :action="uploadUrl"
                :headers="token"
                  :show-file-list="false"
                  :on-success="doorUpLoadSuccessF03"
                  :before-upload="beforeUploadImgF03"
                  >
                  <img v-if="operateForm.pIdcardA" :src="operateForm.pIdcardA" class="avatar">
                  <div v-else>
                     <img style="margin-bottom: -15px;" class="avatar-none"  src="https://dashboard.huifu.com/member/static/img/default-idcard-front.svg" alt="">
                    <el-button size="mini" type="primary">点击上传</el-button>
                  </div>
                  <!-- <i v-else class="el-icon-plus"></i> -->
                </el-upload>
               </el-form-item>
               <el-form-item label="法人身份证国徽面" prop="pIdcardB" style="margin-left: 50px;">
                <el-upload
                :action="uploadUrl"
                :headers="token"
                  :show-file-list="false"
                  :on-success="doorUpLoadSuccessF02"
                  :before-upload="beforeUploadImgF02"
                  >
                  <img v-if="operateForm.pIdcardB" :src="operateForm.pIdcardB" class="avatar">
                  <div v-else style="height: 100%;">
                    <img style="margin-bottom: -15px;" class="avatar-none"  src="https://dashboard.huifu.com/member/static/img/default-idcard-back.svg" alt="">
                    <el-button size="mini" type="primary">点击上传</el-button>
                  </div>
                  <!-- <i v-else class="el-icon-plus"></i> -->
                </el-upload>
               </el-form-item>
             </el-col>
             <el-col :span="6">
                <el-form-item label="法人姓名" prop="legalName"  style="width: 100%;">
                  <el-input  v-model.trim="operateForm.legalName" style="width: 80%;" placeholder="请输入法人姓名" clearable  />
                </el-form-item>
            </el-col>
            <el-col :span="6">
                <el-form-item label="证件号码" prop="legalCertNo"  style="width: 100%;">
                  <el-input  v-model.trim="operateForm.legalCertNo" style="width: 80%;" placeholder="请输入证件号码" clearable  />
                </el-form-item>
            </el-col>
            <el-col :span="6">
                <el-form-item label="法人证件地址" prop="legalAddr"  style="width: 100%;">
                  <el-input  v-model.trim="operateForm.legalAddr" style="width: 80%;" placeholder="请输入法人证件地址" clearable  />
                </el-form-item>
            </el-col>
            <el-col :span="12">
                <el-form-item label="证件有效期" prop="legalCertStt" style="width: 100%;">
              <el-date-picker
                v-model="operateForm.legalCertStt"
                value-format="yyyyMMdd"
                type="date"
                placeholder="开始日期">
              </el-date-picker>
              <span style="margin: 0 10px;">至</span>
              <el-date-picker
                v-model="operateForm.legaCertExpire"
                value-format="yyyyMMdd"
                :disabled="operateForm.legalCertValidityType > 0"
                type="date"
                placeholder="截止日期">
              </el-date-picker>
                <el-checkbox style="margin-left: 20px;" true-label="1" false-label="0" v-model="operateForm.legalCertValidityType" @change="legalChange">长期有效</el-checkbox>
            </el-form-item>
            </el-col>
        </el-row>
    </el-card>
    <el-card class="index">
        <div slot="header" class="clearfix">
        <span>经营信息</span>
      </div>
        <el-row>
          <el-col :span="6">
            <el-form-item label="公司类型" prop="merchantType"  style="width: 100%;">
              <el-select clearable v-model="operateForm.merchantType" style="width: 80%;"  @change="merchantTypeChange"  placeholder="请选择经营场景">
                     <el-option
                       v-for="item in companyTypeList"
                       :key="item.value"
                       :label="item.lable"
                       :value="item.value">
                     </el-option>
                    </el-select>
            </el-form-item>
          </el-col>
          <el-col :span="6">
            <el-form-item label="商户名称" prop="merchantBusinessName"  style="width: 100%;">
              <el-input  v-model.trim="operateForm.merchantBusinessName" style="width: 80%;" placeholder="请输入商户名称" clearable  />
            </el-form-item>
          </el-col>
          <el-col :span="6">
            <el-form-item label="商户简称" prop="merchantShortName"  style="width: 100%;">
              <el-input  v-model.trim="operateForm.merchantShortName" style="width: 80%;" placeholder="请输入商户简称" clearable  />
            </el-form-item>
          </el-col>
          <el-col :span="6">
            <el-form-item label="商户负责人" prop="contactName"  style="width: 100%;">
              <el-input  v-model.trim="operateForm.contactName" style="width: 80%;" placeholder="请输入商户负责人" clearable  />
            </el-form-item>
          </el-col>
          <el-col :span="6">
            <el-form-item label="手机号" prop="contactPhone"  style="width: 100%;">
              <el-input  v-model.trim="operateForm.contactPhone" style="width: 80%;" placeholder="请输入手机号" clearable  />
            </el-form-item>
          </el-col>
         
          <el-col :span="6">
            <el-form-item label="客服电话" prop="servicePhone"  style="width: 100%;">
              <el-input  v-model.trim="operateForm.servicePhone" style="width: 80%;" placeholder="请输入客服电话" clearable  />
            </el-form-item>
          </el-col>
          <el-col :span="6">
            <el-form-item label="邮箱" prop="contactEmail"  style="width: 100%;">
              <el-input  v-model.trim="operateForm.contactEmail" style="width: 80%;" placeholder="请输入邮箱" clearable  />
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="6">
            <el-form-item label="所属行业" prop="mccId1" style="width: 100%;">
                  <el-select clearable v-model="operateForm.mccId1" style="width: 80%;"  @change="enterpriseChange1"  placeholder="请选择经营场景">
                     <el-option
                       v-for="item in mccList1"
                       :key="item.id"
                       :label="item.mcc2Name"
                       :value="item.id">
                     </el-option>
                    </el-select>
              </el-form-item>
          </el-col>
          <el-col :span="6">
            <el-form-item label=" "   style="width: 100%;margin-top:23px;">
                  <el-select clearable v-model="operateForm.mccId" style="width: 80%;"   placeholder="请选择经营场景">
                     <el-option
                       v-for="item in mccList2"
                       :key="item.id"
                       :label="item.mcc3Name"
                       :value="item.id">
                     </el-option>
                    </el-select>
              </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="24">
               <el-form-item label="店铺门头照" prop="pOutside" >
                <el-upload
                :action="uploadUrl"
                :headers="token"
                  :show-file-list="false"
                  :on-success="doorUpLoadSuccessF22"
                  :before-upload="beforeUploadImgF22"
                  >
                  <img v-if="operateForm.pOutside" :src="operateForm.pOutside" class="avatar">
                  <div v-else>
                     <img style="margin-bottom: -15px;" class="avatar-none"  src="https://dashboard.huifu.com/member/static/img/default-img.svg" alt="">
                    <el-button size="mini" type="primary">点击上传</el-button>
                  </div>
                  <!-- <i v-else class="el-icon-plus"></i> -->
                </el-upload>
               </el-form-item>
               <el-form-item label="店铺内景/工作区域照" prop="pInside" style="margin-left: 50px;">
                <el-upload
                :action="uploadUrl"
                :headers="token"
                  :show-file-list="false"
                  :on-success="doorUpLoadSuccessF24"
                  :before-upload="beforeUploadImgF24"
                  >
                  <img v-if="operateForm.pInside" :src="operateForm.pInside" class="avatar">
                  <div v-else style="height: 100%;">
                    <img style="margin-bottom: -15px;" class="avatar-none"  src="https://dashboard.huifu.com/member/static/img/default-img.svg" alt="">
                    <el-button size="mini" type="primary">点击上传</el-button>
                  </div>
                  <!-- <i v-else class="el-icon-plus"></i> -->
                </el-upload>
               </el-form-item>
               <el-form-item label="店铺收银台/公司前台照" prop="pCashier" style="margin-left: 50px;">
                <el-upload
                :action="uploadUrl"
                :headers="token"
                  :show-file-list="false"
                  :on-success="doorUpLoadSuccessF105"
                  :before-upload="beforeUploadImgF105"
                  >
                  <img v-if="operateForm.pCashier" :src="operateForm.pCashier" class="avatar">
                  <div v-else>
                     <img style="margin-bottom: -15px;" class="avatar-none"  src="https://dashboard.huifu.com/member/static/img/default-img.svg" alt="">
                    <el-button size="mini" type="primary">点击上传</el-button>
                  </div>
                  <!-- <i v-else class="el-icon-plus"></i> -->
                </el-upload>
               </el-form-item>
             </el-col>
        </el-row>
    </el-card>
    <el-card class="index">
        <div slot="header" class="clearfix">
        <span>银行卡绑定</span>
      </div>
        <el-row>
             <el-col :span="6">
                <el-form-item label="银行账户类型" prop="accountType"  style="width: 100%;">
                  <el-select clearable  style="width: 80%;" v-model="operateForm.accountType"  @change="enterpriseChange" filterable placeholder="请选择/搜索开户行">
                   <el-option label="对公" :value="1" v-if="operateForm.merchantType == 1"/>
                   <el-option label="法人对私" :value="2" />
                   <el-option label="非法人对私" :value="3" />
                </el-select>
                </el-form-item>
             </el-col>
             <el-col :span="6">
                <el-form-item label="银行账户名称" prop="accountCardName"  style="width: 100%;">
                  <el-input   type="text" v-model.trim="operateForm.accountCardName" style="width: 80%;" placeholder="请输入银行账户名称" clearable  />
                </el-form-item>
            </el-col>
            <el-col :span="6">
                <el-form-item label="银行账户号" prop="accountCardNum"  style="width: 100%;">
                  <el-input   type="text" v-model.trim="operateForm.accountCardNum" style="width: 80%;" placeholder="请输入银行账户号" clearable  />
                </el-form-item>
            </el-col>
            <el-col :span="6">
                <el-form-item label="银行名称" prop="bankId" style="width: 100%;">
                  <el-select  style="width: 80%;" clearable v-model="operateForm.bankId"  @change="enterpriseChange" filterable placeholder="请选择/搜索开户行">
                   <el-option
                     v-for="item in dLimitList"
                     :key="item.id"
                     :label="item.parent_name"
                     :value="item.id">
                   </el-option>
                </el-select>
              </el-form-item>
            </el-col>
            <el-col :span="6">
                <el-form-item label="银行预留手机号" prop="accountPhone"  style="width: 100%;">
                  <el-input   type="text" v-model.trim="operateForm.accountPhone" style="width: 80%;" placeholder="请输入银行预留手机号" clearable  />
                </el-form-item>
            </el-col>
            <el-col :span="6">
                <el-form-item label="开户许可证核准号" prop="openLicenceNo"  style="width: 100%;">
                  <el-input   type="text" v-model.trim="operateForm.openLicenceNo" style="width: 80%;" placeholder="请输入开户许可证核准号" clearable  />
                </el-form-item>
            </el-col>
            <el-col :span="6">
                <el-form-item label="持卡人证件号码" prop="principalCertNo"  style="width: 100%;" v-if="operateForm.accountType == 3">
                  <el-input   type="text" v-model.trim="operateForm.principalCertNo" style="width: 80%;" placeholder="请输入结算费率" clearable  />
                </el-form-item>
            </el-col>
            <el-col :span="6">
                <el-form-item label="结算费率" prop="rate"  style="width: 100%;">
                  <el-input   type="number" v-model.trim="operateForm.rate" style="width: 80%;" placeholder="请输入结算费率" clearable  > 
                    <template slot="append">万分比</template>
                  </el-input>
                </el-form-item>
            </el-col>
           
            <el-col :span="12" v-if="operateForm.accountType == 3">
                <el-form-item label="持卡人证件有效期" prop="principalCertStt"  style="width: 100%;">
                  <el-date-picker
                v-model="operateForm.principalCertStt"
                value-format="yyyyMMdd"
                type="date"
                placeholder="开始日期">
              </el-date-picker>
              <span style="margin: 0 10px;">至</span>
              <el-date-picker
                v-model="operateForm.principalCertExpire"
                value-format="yyyyMMdd"
                :disabled="operateForm.certValidityType > 0"
                type="date"
                placeholder="截止日期">
              </el-date-picker>
                <el-checkbox style="margin-left: 20px;" true-label="1" false-label="0" v-model="operateForm.certValidityType" @change="certChange">长期有效</el-checkbox>
                </el-form-item>
            </el-col>
            <el-col :span="6">
               <el-form-item
                 label="安心签验证码"
                 prop="checkCode"
               >
               <div style="display:flex;justify-content:center;">
                 <el-input v-model="operateForm.checkCode" placeholder="请输入验证码"></el-input>
                   <el-button style="margin-left:10px;" type="primary" @click.prevent="getCode()"   :disabled="!checkCodeChow">
                     <span v-show="checkCodeChow">获取验证码</span>
                     <span v-show="!checkCodeChow" class="count">{{count}} s</span>
                   </el-button>
               </div>
             </el-form-item>
            </el-col>
            <!-- <el-col :span="12">
                <el-form-item label="持卡人证件号码" prop="principalCertNo"  style="width: 100%;">
                  <el-input   type="text" v-model="operateForm.principalCertNo" style="width: 80%;" placeholder="请输入结算费率" clearable  />
                </el-form-item>
            </el-col> -->
        </el-row>
        <el-row> 
            <el-col :span="6" v-if="operateForm.accountType == '2'">
               <el-form-item label="银行卡卡号面" prop="pBankcardA" >
                <el-upload
                :action="uploadUrl"
                :headers="token"
                  :show-file-list="false"
                  :on-success="doorUpLoadSuccessF13"
                  :before-upload="beforeUploadImgF13"
                  >
                  <img v-if="operateForm.pBankcardA" :src="operateForm.pBankcardA" class="avatar">
                  <div v-else>
                     <img style="margin-bottom: -15px;" class="avatar-none"  src="https://dashboard.huifu.com/member/static/img/default-bank-front.svg" alt="">
                    <el-button size="mini" type="primary">点击上传</el-button>
                  </div>
                </el-upload>
               </el-form-item>
             </el-col>
             <el-col :span="6" v-if="operateForm.accountType == '1'">
               <el-form-item label="开户许可证" prop="pOpenAccount" >
                <el-upload
                :action="uploadUrl"
                :headers="token"
                  :show-file-list="false"
                  :on-success="doorUpLoadSuccessF08"
                  :before-upload="beforeUploadImgF08"
                  >
                  <img v-if="operateForm.pOpenAccount" :src="operateForm.pOpenAccount" class="avatar">
                  <div v-else>
                     <img style="margin-bottom: -15px;" class="avatar-none"  src="https://dashboard.huifu.com/member/static/img/default-img.svg" alt="">
                    <el-button size="mini" type="primary">点击上传</el-button>
                  </div>
                </el-upload>
               </el-form-item>
             </el-col>
             <el-col :span="18" v-if="operateForm.accountType == '3'">
               <el-form-item label="银行卡卡号面" prop="pBankcardA" >
                <el-upload
                :action="uploadUrl"
                :headers="token"
                  :show-file-list="false"
                  :on-success="doorUpLoadSuccessF13"
                  :before-upload="beforeUploadImgF13"
                  >
                  <img v-if="operateForm.pBankcardA" :src="operateForm.pBankcardA" class="avatar">
                  <div v-else>
                     <img style="margin-bottom: -15px;" class="avatar-none"  src="https://dashboard.huifu.com/member/static/img/default-bank-front.svg" alt="">
                    <el-button size="mini" type="primary">点击上传</el-button>
                  </div>
                </el-upload>
               </el-form-item>
               <el-form-item label="持卡人身份证人像面" prop="pBankIdcardA" style="margin-left: 50px;">
                <el-upload
                :action="uploadUrl"
                :headers="token"
                  :show-file-list="false"
                  :on-success="doorUpLoadSuccessF56"
                  :before-upload="beforeUploadImgF56"
                  >
                  <img v-if="operateForm.pBankIdcardA" :src="operateForm.pBankIdcardA" class="avatar">
                  <div v-else>
                     <img style="margin-bottom: -15px;" class="avatar-none"  src="https://dashboard.huifu.com/member/static/img/default-idcard-front.svg" alt="">
                    <el-button size="mini" type="primary">点击上传</el-button>
                  </div>
                </el-upload>
               </el-form-item>
               <el-form-item label="持卡人身份证国徽面" prop="pBankIdcardB" style="margin-left: 50px;">
                <el-upload
                :action="uploadUrl"
                :headers="token"
                  :show-file-list="false"
                  :on-success="doorUpLoadSuccessF55"
                  :before-upload="beforeUploadImgF55"
                  >
                  <img v-if="operateForm.pBankIdcardB" :src="operateForm.pBankIdcardB" class="avatar">
                  <div v-else>
                     <img style="margin-bottom: -15px;" class="avatar-none"  src="https://dashboard.huifu.com/member/static/img/default-idcard-back.svg" alt="">
                    <el-button size="mini" type="primary">点击上传</el-button>
                  </div>
                </el-upload>
               </el-form-item>
               <el-form-item label="授权委托书" prop="pUnincorporated" style="margin-left: 50px;">
                <el-button type="text" class="dlowClass" @click="dlowPorated">下载模板</el-button>
                <el-upload
                :action="uploadUrl"
                :headers="token"
                  :show-file-list="false"
                  :on-success="doorUpLoadSuccessF520"
                  :before-upload="beforeUploadImgF520"
                  >
                  <img v-if="operateForm.pUnincorporated" :src="operateForm.pUnincorporated" class="avatar">
                  <div v-else>
                     <img style="margin-bottom: -15px;" class="avatar-none"  src="https://dashboard.huifu.com/member/static/img/default-doc.svg" alt="">
                    <el-button size="mini" type="primary">点击上传</el-button>
                  </div>
                </el-upload>
               </el-form-item>
             </el-col>
        </el-row>
    </el-card>
  </el-form>
  </div>
</template>

<script>
import { arealist , getTopMccByType , anxinSignCompany } from '@/api/api'
export default{
    props:{
      regionList:[Array],
      secondaryList:[Array],
      mccList1:[Array],
      dLimitList:[Array],
      minProfitRate:[String,Number],
      channelId:[String]
    },
    data(){
        return{
            uploadUrl: process.env.VUE_APP_BASE_URL + `/product/v31/api/merchant/upload/`,
            token: { token: sessionStorage.getItem("token") },
            checkCodeChow:true,
            count:60,
            operateForm:{
              isOnline:0,
              licenseValidityType:0,
              legalCertValidityType:0,
              certValidityType:0,
              merchantName:'',
              businessLicence:'',
              merchantAddress:'',
              businessLicenceStt:'',
              businessLicenceExpire:'',
              legalName:'',
              legalCertNo:'',
              legalAddr:'',
              legalCertStt:'',
              legaCertExpire:'',
              accountCardNum:'',
              principalCertNo:'',
              principalCertStt:'',
              principalCertExpire:'',
              validPeriodStat:'',
              mccId:''
              // bankId:'134637'
            },
            operateFormRules:{
              pLicense:[{required: true, validator:(rule , value , callback)=>{
                    if(this.operateForm.pLicense){
                        callback();
                    }else{
                        callback(new Error('请上传营业执照附件！'))
                    }
                 } }],
                 merchantBusinessName:[{ required: true, message: '请输入商户名称', trigger: 'blur' }],
                 businessLicence:[{ required: true, message: '请输入营业执照编号', trigger: 'blur' }],
                 areaArr:[{ required: true, message: '请输入商户注册地址', trigger: 'blur' }],
                 merchantAddress:[{ required: true, message: '请输入商户注册详细地址', trigger: 'blur' }],
                 checkCode:[{ required: true, message: '请请输入验证码', trigger: 'blur' }],
                 businessLicenceStt:[{ required: true, validator:(rule , value , callback)=>{
                   if(this.operateForm.licenseValidityType){
                     if(!this.operateForm.businessLicenceStt){
                         callback(new Error('请选择开始日期！'))
                       }else{
                         callback()
                       }
                   }else{
                     if(!this.operateForm.businessLicenceStt){
                         callback(new Error('请选择开始日期！'))
                       }else if(!this.operateForm.businessLicenceExpire){
                         callback(new Error('请选择截止日期！'))
                       }else{
                         callback()
                       }
                   }
                 } }],
                 pIdcardA:[{required: true, validator:(rule , value , callback)=>{
                    if(this.operateForm.pIdcardA){
                        callback();
                    }else{
                        callback(new Error('请上传法人身份证人像面！'))
                    }
                 } }],
                 pIdcardB:[{required: true, validator:(rule , value , callback)=>{
                    if(this.operateForm.pIdcardB){
                        callback();
                    }else{
                        callback(new Error('请上传法人身份证国徽面！'))
                    }
                 } }],
                 legalName:[{ required: true, message: '请输入法人姓名', trigger: 'blur' }],
                 legalCertNo:[{ required: true, message: '请输入证件号码', trigger: 'blur' }],
                 legalAddr:[{ required: true, message: '请输入法人证件地址', trigger: 'change' }],
                 legalCertStt:[{ required: true, validator:(rule , value , callback)=>{
                   if(this.operateForm.legalCertValidityType){
                     if(!this.operateForm.legalCertStt){
                         callback(new Error('请选择开始日期！'))
                       }else{
                         callback()
                       }
                   }else{
                     if(!this.operateForm.legalCertStt){
                         callback(new Error('请选择开始日期！'))
                       }else if(!this.operateForm.legaCertExpire){
                         callback(new Error('请选择截止日期！'))
                       }else{
                         callback()
                       }
                   }
                 } }],
                 principalCertStt:[{ required: true, validator:(rule , value , callback)=>{
                   if(this.operateForm.certValidityType){
                     if(!this.operateForm.principalCertStt){
                         callback(new Error('请选择开始日期！'))
                       }else{
                         callback()
                       }
                   }else{
                     if(!this.operateForm.principalCertStt){
                         callback(new Error('请选择开始日期！'))
                       }else if(!this.operateForm.principalCertExpire){
                         callback(new Error('请选择截止日期！'))
                       }else{
                         callback()
                       }
                   }
                 } }],
                 merchantType:[{ required: true, message: '请输入公司类型', trigger: 'blur' }],
                 merchantName:[{ required: true, message: '请输入商户注册名称', trigger: 'blur' }],
                 merchantShortName:[{ required: true, message: '请输入商户简称', trigger: 'blur' }],
                 contactName:[{ required: true, message: '请输入商户负责人', trigger: 'blur' }],
                 contactPhone:[{ required: true, message: '请输入手机号', trigger: 'blur' }],
                 servicePhone:[{ required: true, message: '请输入客服电话', trigger: 'blur' }],
                 contactEmail:[{ required: true, message: '请输入邮箱', trigger: 'blur' }],
                 mccId1:[{ required: true, validator:(rule , value , callback)=>{
                    if(this.operateForm.mccId1  && this.operateForm.mccId){
                        callback();
                    }else{
                        callback(new Error('请选择完整的行业信息！'))
                    }
                 } }],
                 pOutside:[{required: true, validator:(rule , value , callback)=>{
                    if(this.operateForm.pOutside){
                        callback();
                    }else{
                        callback(new Error('请上传店铺门头照！'))
                    }
                 } }],
                 pInside:[{required: true, validator:(rule , value , callback)=>{
                    if(this.operateForm.pInside){
                        callback();
                    }else{
                        callback(new Error('请上传店铺内景/工作区域照！'))
                    }
                 } }],
                 pCashier:[{required: true, validator:(rule , value , callback)=>{
                    if(this.operateForm.pCashier){
                        callback();
                    }else{
                        callback(new Error('请上传店铺收银台/公司前台照！'))
                    }
                 } }],
                 accountType:[{ required: true, message: '请选择银行账户类型', trigger: 'change' }],
                 accountCardName:[{ required: true, message: '请输入银行账户名称', trigger: 'blur' }],
                 accountCardNum:[{ required: true, message: '请输入银行账户号', trigger: 'blur' }],
                 bankId:[{ required: true, message: '请选择银行名称', trigger: 'change' }],
                 accountPhone:[{ required: true, message: '请输入银行预留手机号', trigger: 'blur' }],
                 rate:[{ required: true, message: '请输入结算费率', trigger: 'blur' },
                        {required: true, validator:(rule , value , callback)=>{
                            const rateRules = new RegExp("^[0-9]*[1-9][0-9]*$")
                            if(rateRules.test(value)){
                              if(this.minProfitRate){
                               if(value < this.minProfitRate){
                                callback(new Error('结算费率不能低于业务经理结算最低费率'))
                               }else{
                                callback()
                               }
                              }else{
                                  callback(new Error('请选择业务经理！'))
                              }
                            }else{
                              callback(new Error('结算费率只能是正整数！'))
                            }
                           
                        } }
                 ],
                 principalCertNo:[{ required: true, message: '请输入持卡人证件号码', trigger: 'blur' }],
                 pOpenAccount:[{required: true, validator:(rule , value , callback)=>{
                    if(this.operateForm.pOpenAccount){
                        callback();
                    }else{
                        callback(new Error('请上传开户许可证！'))
                    }
                 } }],
                 pBankcardA:[{required: true, validator:(rule , value , callback)=>{
                    if(this.operateForm.pBankcardA){
                        callback();
                    }else{
                        callback(new Error('请上传银行卡卡号面！'))
                    }
                 } }],
                 pBankIdcardA:[{required: true, validator:(rule , value , callback)=>{
                    if(this.operateForm.pBankIdcardA){
                        callback();
                    }else{
                        callback(new Error('请上传持卡人身份证人像面！'))
                    }
                 } }],
                 pBankIdcardB:[{required: true, validator:(rule , value , callback)=>{
                    if(this.operateForm.pBankIdcardB){
                        callback();
                    }else{
                        callback(new Error('请上传持卡人身份证国徽面！'))
                    }
                 } }],
                 pUnincorporated:[{required: true, validator:(rule , value , callback)=>{
                    if(this.operateForm.pUnincorporated){
                        callback();
                    }else{
                        callback(new Error('请上传授权委托书！'))
                    }
                 } }],
            },
            professionList:[ { value:'1A',lable:'各类专业,技术人员' } , { value:'1B',lable:'国家机关,党群组织,企事业单位的负责人' } , { value:'1C',lable:'办事人员和有关人员' } , { value:'1D',lable:'商业工作人员' } , { value:'1E',lable:'服务性工作人员' } , { value:'1F',lable:'农林牧渔劳动者' } , { value:'1G',lable:'生产工作,运输工作和部分体力劳动者' } , { value:'1H',lable:'不便分类的其他劳动者' }],
            companyTypeList:[ { value:1,lable:'私营企业'} , { value:2,lable:'个体工商户'} ], //公司类型
            detailRegion:{
              value:'id',
              label:'label',
            },
            mccList2:[],
            mccList3:[],
            mccProps:{
              lazy: true,
              value:'id',
              label:'mcc1Name',
              lazyLoad(node, resolve){
                let  level = node.level + 1
                setTimeout(async ()=>{
                  const res = await getTopMccByType({parentId:node.value,channelType:'16',level:level})
                  res.data.forEach(item=>{
                    if(node.level == 1){
                      item.mcc1Name = item.mcc2Name
                    }else{
                      item.mcc1Name = item.mcc3Name
                      item.leaf = 1
                    }
                  })
                  // console.log(this.mccList)
                  resolve(res.data);
                },1)
              }
            },
        }
    },
    methods:{
      async getCode(){
        const res = await anxinSignCompany({
          contactPhone:this.operateForm.contactPhone,
          principalCertNo:this.operateForm.accountType == 2 ? this.operateForm.legalCertNo : this.operateForm.principalCertNo  ,
          accountCardName:this.operateForm.accountCardName,
          accountCardNum:this.operateForm.accountCardNum,
          merchantName:this.operateForm.merchantName,
          businessLicence:this.operateForm.businessLicence,
          merchantAddress:this.operateForm.merchantAddress,
          legalCertNo:this.operateForm.legalCertNo,
          legalName:this.operateForm.legalName
        })
        if(res.code == 200){
          this.checkCodeChow = false
          this.count = 60
          this.countCoument()
        }else{
          this.$message.error(res.message)
        }
      },
      countCoument(){
        if(this.count>0){
          this.count--
          setTimeout(()=>{
            this.countCoument()
          },1000)
        }else{
          this.checkCodeChow = true
        }
      },
      // 
      dlowPorated(){
        let elink = document.createElement('a');
        elink.href = 'https://sdd-merchant.oss-cn-shanghai.aliyuncs.com/addMerchant/huifu.docx'
        elink.click();
        loading.close();
      },
    async  enterpriseChange1(v,type,merchantType){
      const res = await getTopMccByType({channelType:'45',level:3 , parentId:v,merchantType:merchantType})
      this.mccList2 = res.data
      if(type == 'none'){

      }else{
        this.operateForm.mccId2 = ''
        this.operateForm.mccId = ''
      }
      
      },
   
      beforeUploadImgF03(){
        return new Promise((resolve, reject) => {
               this.uploadUrl = process.env.VUE_APP_BASE_URL + `/product/mini/upload/1`
                setTimeout(() => {
                    resolve() 
                }, 100)
                
          })
      },
      doorUpLoadSuccessF03(file){
        if(file.code == 200){
          //  this.operateForm.pIdcardAFileId = file.data.file_id
           this.operateForm.pIdcardA = file.data.filePath
           if(file.data.name){
            this.operateForm.legalName = file.data.name
            this.operateForm.legalCertNo = file.data.idNumber
            this.operateForm.legalAddr = file.data.address
           }
        }else{
          this.$message.error(file.message)
        }
        this.$forceUpdate()
      },
      licenseChange(v){
        if(v == '1'){
           this.operateForm.businessLicenceExpire = '29991231'
        }else{
          this.operateForm.businessLicenceExpire = ''
        }
      },
      legalChange(v){
        if(v == '1'){
           this.operateForm.legaCertExpire = '29991231'
        }else{
          this.operateForm.legaCertExpire  = ''
        }
      },
      merchantTypeChange(v){
        if(v == 2 && this.operateForm.accountType == 1){
          this.operateForm.accountType = null
        }
        this.$emit('gitMccList',v)
        // 
      },
      certChange(v){
        if(v == '1'){
           this.operateForm.principalCertExpire = '29991231'
        }else{
          this.operateForm.principalCertExpire  = ''
        }
      },
      beforeUploadImgF02(){
        return new Promise((resolve, reject) => {
               this.uploadUrl = process.env.VUE_APP_BASE_URL + `/product/mini/upload/1`
                setTimeout(() => {
                    resolve() 
                }, 100)
                
          })
      },
      doorUpLoadSuccessF02(file){
        if(file.code == 200){
          //  this.operateForm.pIdcardBFileId = file.data.file_id
           this.operateForm.pIdcardB = file.data.filePath
           if(file.data.validPeriodStat){
              this.operateForm.legalCertStt = file.data.validPeriodStat.replace(/-/g, "")
             if(file.data.validPeriodEnd == '' || file.data.validPeriodEnd == '29991231'){
               this.operateForm.legalCertValidityType = '1'
               this.operateForm.legaCertExpire = '29991231'
             }else{
               this.operateForm.legaCertExpire = file.data.validPeriodEnd.replace(/-/g, "")
             }
           }
        }else{
          this.$message.error(file.message)
        }
        this.$forceUpdate()
      },
      beforeUploadImgF07(){
        return new Promise((resolve, reject) => {
               this.uploadUrl = process.env.VUE_APP_BASE_URL + `/product/mini/upload/0`
                setTimeout(() => {
                    resolve() 
                }, 100)
                
          })
      },
      doorUpLoadSuccessF07(file){
        if(file.code == 200){
           this.operateForm.pLicense = file.data.filePath
           if(file.data.companyName){
            this.operateForm.merchantName = file.data.companyName
            this.operateForm.businessLicence = file.data.creditCode
            this.operateForm.merchantAddress = file.data.businessAddress
            this.operateForm.businessLicenceStt = file.data.validFromDate.replace(/-/g, "")
            if(file.data.validToDate == '' || file.data.validToDate == '29991231'){
              this.operateForm.licenseValidityType = '1'
              this.operateForm.businessLicenceExpire = '29991231'
            }else{
               this.operateForm.businessLicenceExpire = file.data.validToDate.replace(/-/g, "")
            } 
          }
        }else{
          this.$message.error(file.message)
        }
        this.$forceUpdate()
      },
      beforeUploadImgF22(){
        return new Promise((resolve, reject) => {
               this.uploadUrl = process.env.VUE_APP_BASE_URL + `/product/mini/upload/99`
                setTimeout(() => {
                    resolve() 
                }, 100)
                
          })
      },
      doorUpLoadSuccessF22(file){
        if(file.code == 200){
           this.operateForm.pOutside = file.data.filePath
        }else{
          this.$message.error(file.message)
        }
        this.$forceUpdate()
      },
      beforeUploadImgF24(){
        return new Promise((resolve, reject) => {
               this.uploadUrl = process.env.VUE_APP_BASE_URL + `/product/mini/upload/99`
                setTimeout(() => {
                    resolve() 
                }, 100)
                
          })
      },
      doorUpLoadSuccessF24(file){
        if(file.code == 200){
           this.operateForm.pInside = file.data.filePath
        }else{
          this.$message.error(file.message)
        }
        this.$forceUpdate()
      },
      beforeUploadImgF105(){
        return new Promise((resolve, reject) => {
               this.uploadUrl = process.env.VUE_APP_BASE_URL + `/product/mini/upload/99`
                setTimeout(() => {
                    resolve() 
                }, 100)
                
          })
      },
      doorUpLoadSuccessF105(file){
        if(file.code == 200){
           this.operateForm.pCashier = file.data.filePath
        }else{
          this.$message.error(file.message)
        }
        this.$forceUpdate()
      },
      beforeUploadImgF13(){
        return new Promise((resolve, reject) => {
               this.uploadUrl = process.env.VUE_APP_BASE_URL + `/product/mini/upload/2`
                setTimeout(() => {
                    resolve() 
                }, 100)
          })
      },
      doorUpLoadSuccessF13(file){
        if(file.code == 200){
          //  this.operateForm.pBankcardAFileId = file.data.file_id
           this.operateForm.pBankcardA = file.data.filePath
           if(file.data.cardNumber){
            this.operateForm.accountCardNum = file.data.cardNumber
           }
        }else{
          this.$message.error(file.message)
        }
        this.$forceUpdate()
      },
      
      beforeUploadImgF08(){
        return new Promise((resolve, reject) => {
               this.uploadUrl = process.env.VUE_APP_BASE_URL + `/product/mini/upload/99`
                setTimeout(() => {
                    resolve() 
                }, 100)
          })
      },
      doorUpLoadSuccessF08(file){
        if(file.code == 200){
          //  this.operateForm.pOpenAccountFileId = file.data.file_id
           this.operateForm.pOpenAccount = file.data.filePath
        }else{
          this.$message.error(file.message)
        }
        this.$forceUpdate()
      },
      beforeUploadImgF56(){
        return new Promise((resolve, reject) => {
               this.uploadUrl = process.env.VUE_APP_BASE_URL + `/product/mini/upload/1`
                setTimeout(() => {
                    resolve() 
                }, 100)
          })
      },
      doorUpLoadSuccessF56(file){
        if(file.code == 200){
          //  this.operateForm.pBankIdcardAFileId = file.data.file_id
           this.operateForm.pBankIdcardA = file.data.filePath
           if(file.data.idNumber){
             this.operateForm.principalCertNo = file.data.idNumber
           }

        }else{
          this.$message.error(file.message)
        }
        this.$forceUpdate()
      },
      beforeUploadImgF55(){
        return new Promise((resolve, reject) => {
               this.uploadUrl = process.env.VUE_APP_BASE_URL + `/product/mini/upload/1`
                setTimeout(() => {
                    resolve() 
                }, 100)
          })
      },
      doorUpLoadSuccessF55(file){
        if(file.code == 200){
           this.operateForm.pBankIdcardB = file.data.filePath
           if(file.data.validPeriodStat){
            this.operateForm.principalCertStt = file.data.validPeriodStat.replace(/-/g, "")
           if(file.data.validPeriodEnd == '' || file.data.validPeriodEnd == '29991231'){
              this.operateForm.certValidityType = '1'
              this.operateForm.principalCertExpire = '29991231'
           }else{
              this.operateForm.principalCertExpire = file.data.validPeriodEnd.replace(/-/g, "")
           }
           }
        }else{
          this.$message.error(file.message)
        }
        this.$forceUpdate()
      },
      beforeUploadImgF520(){
        return new Promise((resolve, reject) => {
               this.uploadUrl = process.env.VUE_APP_BASE_URL + `/product/mini/upload/99`
                setTimeout(() => {
                    resolve() 
                }, 100)
          })
      },
      doorUpLoadSuccessF520(file){
        if(file.code == 200){
          //  this.operateForm.pUnincorporatedFileId = file.data.file_id
           this.operateForm.pUnincorporated = file.data.filePath
        }else{
          this.$message.error(file.message)
        }
        this.$forceUpdate()
      },
      geRegionChange(v){
        this.operateForm.mccId = v[2]
      },
      detailRegionChange(v){
        this.operateForm.areaId = v[2]
      }
    }
}
</script>

<style scoped>
   .index{
    width: 100%;
    margin-bottom: 30px;
   }
   .clearfix{
    display: flex;
    align-items: center;
    justify-content: space-between;
   }
   .avatar{
    width: 112px;
    height: 102px;
  }
.avatar-none{
    width: 112px;
    height: 102px;
}
::v-deep .el-form-item--small.el-form-item{
    /* text-align: center; */
    /* margin-right: 130px; */
}
::v-deep .el-col{
    display:flex;
    /* justify-content:space-between; */

}
::v-deep .el-upload--text{
    width: 112px !important;
    border: none !important;
}
.dlowClass{
  position:absolute;
  top:-41px;
  right:-30px;
}
</style>